/**
 * 时间：2024-08-25
 * 作者：waygc
 * 描述：程序入口，用来调整布局等最基础的功能
 * 
 */
import React from "react";
import {
	HashRouter as Router,
	Routes,
	Route,
} from "react-router-dom";

import { Layout } from 'antd';

import { MENU_LIST } from "./../lib/router";

import Menu from "./Menu";
import Head from "./Head";
import TagsView from "./components/TagsView";
import NotMatch from "./components/NotMatch";

import './App.css';
const { Header, Sider, Content } = Layout;

const layoutStyle = {
	borderRadius: 8,
	overflow: 'hidden',
	width: '100%',
	height: '100%'
};

const siderStyle = {
	color: '#fff'
};

const headerStyle = {
	color: '#fff',
	backgroundColor: '#1677ff'
};

const App = () => {
	return (
		<Router>
			<Layout style={layoutStyle}>
				<Sider style={siderStyle} width={ 250 }>
					<nav>
						<Menu />
					</nav>
				</Sider>
				<Layout>
					<Header	style={headerStyle}>
						<Head />
					</Header>
					<Content>
						<TagsView />
						<Routes>
							{
								MENU_LIST.map(obj => {
									return (
										<Route path={obj.path} element={<obj.component />}></Route>
									)
								})
							}
							<Route path="*" element={<NotMatch />} />
						</Routes>
					</Content>
				</Layout>
			</Layout>
		</Router>
	);
};

export default App;
